<template>
  <div>
    <van-row class="van-2" >
      <van-col span="8"><van-icon name="arrow-left" @click="$router.go(-1)" /></van-col>
      <van-col span="8">客户列表信息</van-col>
      <van-col span="8" class="van-1" @click="$router.push(`/visitnew`)">新增</van-col>
    </van-row>
    <form action="/">
      <van-search
        v-model="value"
        show-action
        placeholder="请输入搜索关键词"
        @search="onSearch"
        @cancel="onCancel"
        action-text="搜索"
      />
    </form>
    <van-row class="box" v-for="item in records" :key="item.id" >
      <van-col span="6" class="box-1"><img src="../assets/客户关怀/客户关怀.png" alt=""></van-col>
      <van-col span="6">
          <ul>
              <li>拜访标题</li>
              <li>客户名称</li>
              <li>拜访时间</li>
          </ul>
      </van-col>
        <van-col span="8">
          <ul>
              <li>{{item.visitTitle}}</li>
              <li>{{item.custName}}</li>
              <li>{{item.visitTime}}</li>
              <!-- <li>{{item.custId}}</li> -->
          </ul>
      </van-col>
      <van-col span="4"><van-button type="primary" size="mini">定期回访</van-button></van-col>
    </van-row>
  </div>
</template>

<script>
import {VisitData} from '../request/api'
export default {
  data() {
    return {
      value: "",
      searc: "",
      records:[],
    };
  },
  methods: {
    onSearch(val) {
      this.searc = val;
      console.log(this.searc, 123);
    },
    onCancel() {},

  },
  created(){
      VisitData({
          keyword:this.searc,
          current:'1',
          size:'100'
      }).then(res=>{
          console.log(res);
          this.records=res.data.records
        
      })
  }
};
</script>
 
<style lang = "less" scoped>
.van-2 {
  padding: 15px 10px;
  background-color: blue;
}
.van-1 {
  text-align: right;
}
.box{
    padding: 15px;
    background-color: #efefef;
    border-bottom: 1px solid #ccc;
    .box-1{
        text-align: center;
    }
    li{
        line-height: 20px;
    }
}
</style>